<template>
	<div class="container">
		<!-- 头部区域 -->
		<div class="header-box">
			<div class="top-box">
				<div class="left-box">
					<img class="avatar-box" :src="
              avatarUrl
                ? avatarUrl
                : 'https://picx.zhimg.com/v2-8d117f237079440cc59baf9ca762d29f_r.jpg?source=1940ef5c'
            " alt="" />
					<div class="text-box" v-if="avatarUrl">
						<div class="name-box">{{ nickName }}</div>
						<div class="lv-box">钻石会员</div>
					</div>
					<div class="text-box" v-else>
						<div @click="wxInfoClick" style="
                border: 1px solid #216be6;
                color: #216be6;
                padding: 10rpx 20rpx;
                border-radius: 30rpx;
              ">
							请完善信息
						</div>
					</div>
				</div>
				<div class="info-btn" @click="informationClick">
					<u-icon name="setting" size="24"></u-icon>
				</div>
			</div>
			<div class="feature-box">
				<div class="item-f">
					<div class="top-f">50</div>
					<div class="bottom-f">总积分</div>
				</div>
				<div class="item-f" @click="CollectLink">
					<div class="top-f">50</div>
					<div class="bottom-f">收藏</div>
				</div>
				<div class="item-f" @click="couponClick">
					<div class="top-f">5</div>
					<div class="bottom-f">卡券</div>
				</div>
			</div>
			<div class="bonus-box">
				<div class="content-box">
					<div class="bonus-left">
						<div class="text-h">福利专区</div>
						<div class="text-p">客户签到、发帖、赚积分</div>
					</div>
					<div class="bonus-right">
						<u-button size="mini">进入</u-button>
					</div>
				</div>
			</div>
		</div>

		<div style="padding: 0 40rpx">
			<!-- 我的订单 -->
			<div class="order-box">
				<div class="top-box" @click="orderClick">
					<div class="left-box">我的订单</div>
					<div class="right-box">全部订单 ></div>
				</div>
				<div class="content-box">
					<div class="item-box">
						<img src="https://t7.baidu.com/it/u=1595072465,3644073269&fm=193&f=GIF" alt="" />
						<div class="text-x">待付款</div>
					</div>
					<div class="item-box">
						<img src="https://t7.baidu.com/it/u=1595072465,3644073269&fm=193&f=GIF" alt="" />
						<div class="text-x">待发货</div>
					</div>
					<div class="item-box">
						<img src="https://t7.baidu.com/it/u=1595072465,3644073269&fm=193&f=GIF" alt="" />
						<div class="text-x">待收获</div>
					</div>
					<div class="item-box">
						<img src="https://t7.baidu.com/it/u=1595072465,3644073269&fm=193&f=GIF" alt="" />
						<div class="text-x">待评价</div>
					</div>
				</div>
			</div>
			<!-- 我的档案 -->
			<div class="archives-box">
				<div class="top-box">
					<div class="left-box">我的档案</div>
					<div class="right-box"></div>
				</div>
				<div class="content-box">
					<div class="item-box" @click="PhysicianManagementClick">
						<img src="https://t7.baidu.com/it/u=1595072465,3644073269&fm=193&f=GIF" alt="" />
						<div class="text-x">我的医生</div>
					</div>
					<div class="item-box" @click="archivalRecordClick">
						<img src="https://t7.baidu.com/it/u=1595072465,3644073269&fm=193&f=GIF" alt="" />
						<div class="text-x">档案记录</div>
					</div>
					<div class="item-box" @click="informationRegistrationClick">
						<img src="https://t7.baidu.com/it/u=1595072465,3644073269&fm=193&f=GIF" alt="" />
						<div class="text-x">信息登记</div>
					</div>
					<div class="item-box">
						<img src="https://t7.baidu.com/it/u=1595072465,3644073269&fm=193&f=GIF" alt="" />
						<div class="text-x">同步数据</div>
					</div>
				</div>
			</div>
			<!-- 我的档案 -->
			<!-- <div class="archives-box">
				<div class="top-box">
					<div class="left-box">我的工具</div>
					<div class="right-box"> </div>
				</div>
				<div class="content-box">
					<div class="item-box">
						<img src="https://t7.baidu.com/it/u=1595072465,3644073269&fm=193&f=GIF" alt="">
						<button class="text-x" open-type='contact' style="border: none;font-size: 12px;">你好客服</button>
					</div>
				</div>
			</div> -->
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				avatarUrl: "",
				nickName: "",
			};
		},
		onReady() {
			this.avatarUrl = uni.getStorageSync("avatarUrl");
			this.nickName = uni.getStorageSync("nickName");
		},
		methods: {
			archivalRecordClick() {
				uni.navigateTo({
					url: "/pages-center/ArchivalRecord/index",
				});
			},
			CollectLink() {
				uni.navigateTo({
					url: "/pages-center/Collect/index",
				});
			},
			wxInfoClick() {
				uni.redirectTo({
					url: "/pages-center/WXinfo/index",
				});
			},
			informationClick() {
				uni.navigateTo({
					url: "/pages-center/Information/index",
				});
			},
			orderClick() {
				uni.navigateTo({
					url: "/pages-shop/OrderInformation/index",
				});
			},
			informationRegistrationClick() {
				uni.navigateTo({
					url: "/pages-center/InformationRegistration/index",
				});
			},
			couponClick() {
				uni.navigateTo({
					url: "/pages-center/Coupon/index",
				});
			},
			PhysicianManagementClick() {
				uni.navigateTo({
					url: '/pages/PhysicianManagement/index'
				})
			}
		},
	};
</script>

<style lang="scss">
	@import "./index.scss";
</style>